<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数据类型</title>
    <script>
        function f1(){
            let num = 1;
            console.log(typeof num);
            num = "admin";
            console.log(typeof(num));
            num = true;
            console.log(typeof(num));
            num = 12.34;
            console.log(typeof num);
        }
        function f2(){
            let name;
            console.log(name);
            console.log(typeof name);
            name = null;
            console.log(name);
            console.log(typeof name);
            name = NaN; // Not a Number
            console.log(name);
            console.log(typeof name);
            let num = "admin";
            num = parseInt(num);
            console.log(num);

        }
        function f3(){
            let arr = [1,2,3,4];
            console.log(arr);
            console.log(typeof arr);
            let date = new Date();
            console.log(date);
            console.log(typeof date);
        }
        function f4(){
            // 使用内部函数的方式定义了一个函数类型的变量
            // 此时是为变量赋予了一个函数的内容
            // 但是该函数不会执行
            let f1 = function(){
                console.log("这是一个函数类型");
                return "f1";
            };
            alert(f1);
            console.log("f1的类型:"+typeof f1);
            // 通过调用函数类型的变量时执行对应函数内容
            // 调用时语法:变量名()
            f1();
        }

        function f5(){
            // 将fn这个函数整体赋值给变量f1
            // 此时的f1代表的是整个fn函数
            let f1 = fn;
            alert(f1);
            console.log(typeof f1);
            // 执行f1变量所对应的fn函数
            f1();
            // fn();
        }

        // 该方式定义的变量不是函数类型
        // 其类型根据调用的函数的返回值而定
        // 对应函数的返回值是什么类型
        // 当前变量即为什么类型
        function f6(){
            // 带有括号的时候,表示执行对应的函数
            // 将函数执行结束之后的返回值赋值给对应的变量
            let f1 = fn();
            console.log(f1)
            console.log(typeof f1);
        }

        function fn(){
            console.log("这是一个函数方法");
            return "admin";
        }
    </script>
</head>
<body>
<button onclick="f1()">基本数据类型</button><br>
<button onclick="f2()">非正常类型</button><br>
<button onclick="f3()">复合类型</button><br>
<button onclick="f4()">函数类型定义方式一</button><br>
<button onclick="f5()">函数类型定义方式二</button><br>
<button onclick="f6()">函数测试</button><br>
</body>
</html>